<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="format-detection" content="email=no"/>
    <meta charset="UTF-8">
    <script type="text/javascript" th:src="@{${session.baseUrl}+'js/common.js'}"></script>
    <script th:src="@{${session.baseUrl}+'js/jquery.js'}"></script>
    <link th:href="@{${session.baseUrl}+'style/reset.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/base.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/header.css'}" rel="stylesheet" type="text/css">
    <link rel="stylesheet" th:href="@{${session.baseUrl}+'style/orderMessage.css'}"/>
    <link th:href="@{${session.baseUrl}+'style/dialog.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/global.css'}" rel="stylesheet" type="text/css">
    <script th:src="@{${session.baseUrl}+'js/dialogbutton.js'}"></script>
    <script th:src="@{${session.baseUrl}+'js/dialog.js'}"></script>
    <title>订单信息</title>
    <style>
        .sub{
            width: 6.3rem;
            background: #2d9cff;
            display: block;
            margin: 0.3rem auto;
            line-height: 0.75rem;
            color: #fff;
            font-size: 0.26rem;
            text-align: center;
            border-radius: 0.1rem;
            cursor: pointer;
            -webkit-appearance: none;
        }
        #error{
            padding-left: 0.3rem;
            font-size: 0.3rem;
            line-height: 0.4rem;
            padding-bottom: 0.3rem;
            font-weight: bold;
        }
    </style>
</head>
<body>
<header><span onclick="javascript:history.go(-1)"></span>订单信息</header>
<h1 style="font-size: 0.32rem;color: #323232;font-weight: bold;padding-top: 0.30rem;padding-left: 0.6rem;" th:text="${memberProjectTransfer.memberProjectName}"></h1>
    <input type="hidden" id="balance" th:value="${balance}">
    <input type="hidden"  id="memberId" name="memberId" th:value="${session.memberId}">
    <input type="hidden"  id="id" th:value="${memberProjectTransfer.id}">

    <div class="pl30 pr30 bgwh">
        <div class="df jcsb aic pl30 pr30 bgwh mt20 all"><span>年化收益率：</span><b style="font-size: 0.4rem;color: red"  th:text="${memberProjectTransfer.rateStr}"></b></div>
        <div class="df jcsb aic pl30 pr30 bgwh mt20 all"><span>转让金额：</span><b th:text="${memberProjectTransfer.transferBuyAmount}" id="money"></b></div>
        <div class="df jcsb aic pl30 pr30 bgwh mt20 all"><span>结束时间：</span><b th:text="${#dates.format(memberProjectTransfer.endTime,'yyyy-MM-dd')}"></b></div>
        <div class="df jcsb aic pl30 pr30 bgwh mt20 all"><span>可用余额：</span><b style="color: #0ba427" th:text="${balance}"></b></div>
    </div>
    <div>
        <span id="error"></span>
    </div>
    <input class="sub" type="submit" onclick="queren()" value="购买"/>





<script type="text/javascript" th:inline="javascript">
    var basePath = /*[[${#httpServletRequest.getScheme() + "://" + #httpServletRequest.getServerName() + ":" + #httpServletRequest.getServerPort() + #httpServletRequest.getContextPath()}]]*/;

    function queren() {
        //验证是否登录
        var memberId = $("#memberId").val();
        //验证用户余额是否足够
        var memberBalance = parseInt($("#balance").val());
        //转让金额
        var money = parseInt($("#money").text());
        var span = $("#error");
        if (memberId == '' || memberId == null) {
            span.html('请登录后重试！').css('color', '#ff2525');
            return false;
        } else if (money > memberBalance) {
            span.html('余额不足，请充值！').css('color', '#ff2525');
            return false;
        } else {
            $('body').dailogbutton({type: 'success', title: '提示', discription: '是否确认购买？'}, function (ret) {
                if (ret.index === 0) {
                    $.ajax({
                        url: basePath + "/memberProjectTransfer/edit1",
                        type: "GET",
                        dataType: "json",
                        data:{
                            id:$("#id").val(),
                        },
                        success: function (e) {
                            var data = e.data;

                            if (data) {
                                $('body').dailog({type: 'success', title: '购买', discription: '购买成功'});
                                self.setInterval(function () {
                                    window.location.href = basePath + "/wap/index.html";
                                }, 3000)
                            }else{
                                $('body').dailogbutton({type: 'warning', title: '提示', discription: '您不能购买自己转让的项目！'});
                                return false;
                            }

                        }
                    })
                } else {
                    $('body').dailog({type: 'success', title: '购买', discription: '取消购买'});
                    self.setInterval(function () {
                        location.reload();
                    }, 3000)
                }
            })
        }
    }
</script>
</body>
</html>